<template>
    <view class="wrap">
      <image
        v-if="type == 'result1'"
        class="img-result"
        src="https://ainengli.hzjrsw.com/jkhx/common/assessment-result-change.png"
      />
      <image
        v-if="type == 'result2' || type == 'result3'"
        class="img-result"
        src="https://ainengli.hzjrsw.com/jkhx/common/assessment-result-sport-suggetion.png"
      />
      <image
        v-if="type == 'result4'"
        class="img-result"
        src="https://ainengli.hzjrsw.com/jkhx/common/assessment-result-not-sport.png"
      />
      <view v-if="type == 'risk'" class="result-text">监测到您为运动高风险人群，</view>
      <view v-if="type == 'risk'" class="result-text">建议您在专业人员指导下进行运动！</view>
      <view @tap="backHome" class="btn confirm-btn">回到首页</view>
      <view @tap="reAnswer" class="btn confirm-btn">查看最新运动方案</view>
    </view>
</template>

<script setup lang="ts">
import { reactive, ref } from 'vue'
import { onLoad, onShow } from '@dcloudio/uni-app'

const type = ref('')

onLoad((option: any) => {
    type.value = option && option.type ? option.type : ''
})

const backHome = () => {
    uni.switchTab({
        url: '/pages/index/index'
    })
}
const reAnswer = () => {
    uni.redirectTo({ url: '/module/src/pages/sports/sportsQuestionnaire/fillin' })
}
</script>

<style lang="scss" scoped>
.wrap {
    background: #fff;
    width: 100vw;
    height: 100vh;
    text-align: center;
    overflow: hidden;
    .img-result {
        display: block;
        width: 420rpx;
        height: 340rpx;
        margin: 124rpx auto 32rpx;
    }
    .result-text {
        font-weight: 700;
        font-size: 32rpx;
        color: #222222;
        margin-bottom: 12rpx;
    }
    .btn {
        border-radius: 44rpx;
        width: 558rpx;
        height: 88rpx;
        line-height: 88rpx;
        font-weight: 700;
        font-size: 32rpx;
    }
    .confirm-btn {
        margin: 52rpx auto 32rpx;
        background: #00d1b6;
        color: #ffffff;
    }
    .cancel-btn {
        margin: 0 auto;
        background: #fff;
        color: #00d1b6;
        border: 1rpx solid #00d1b6;
        transform: rotateZ(360deg);
    }
}
</style>
  